<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>待评审项目</title>
    @include('common-css')
    <style>
        .input_box {
            width: 100%;
            height: 40px;
            margin-top: 15px;
            margin-bottom: 15px;
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }

        .input_label {
            width: 120px;
            box-sizing: border-box;
        }

        .application-list {
            margin-top: 20px;
        }

        .phase-tag {
            color: #1890ff;
            border: 1px solid #91d5ff;
            border-radius: 3px;
            background: #e6f7ff;
            font-size: 12px;
            padding: 2px 3px;
        }

        .ant-table-tbody > tr > td, .ant-table-thead > tr > th {
            vertical-align: middle;
            line-height: 25px;
        }

        .search_box {
            width: 1000px;
        }

        .search_box input {
            width: 300px;
        }

        .search_box button {
            margin-left: 20px;
        }

        .search_box .ant-select {
            margin-left: 20px;
        }
    </style>
</head>
<body>
<div id="app">

</div>
</body>
</html>

<script id="appTemplate" type="x-template">
    <a-locale-provider :locale="antdLocale">
        <div class="container">
            @include('admin.header')

            <main>
                <div class="common_container">

                    @include('admin.aside', ['selectedItem' => 'formal-review'])

                    <div class="common_content">
                        <div v-if="false" class="search_box">
                            <a-input v-model="searchFields.keyword" placeholder="请输入关键字" @pressEnter="searchAward">
                            </a-input>
                            <a-select defaultValue="-1" @change="awardSearchType" style="width: 165px;">
                                <a-select-option value="-1">全部奖项类型</a-select-option>
                                <template v-for="award in awardsInfo">
                                    <a-select-option :value="award.id">@{{award.name}}</a-select-option>
                                </template>
                            </a-select>
                            <a-select defaultValue="-1" @change="awardSearchStatus" style="width: 165px;">
                                <a-select-option value="-1">全部申报状态</a-select-option>
                                <template v-for="(statusItem, statusIndex) in statusInfo">
                                    <a-select-option v-if="statusItem.phase == '形式审查'" :value="statusItem.status">
                                        @{{statusItem.status}}
                                    </a-select-option>
                                </template>
                            </a-select>
                            <a-button type="primary" slot="enterButton" @click="searchAward" style="margin-left: 30px">
                                搜索
                            </a-button>
                            <a-button @click="resetSearch">重置</a-button>
                        </div>
                        <div class="common_box">
                            <a-table class="application-list"
                                     rowKey="id"
                                     :columns="applicationListColumns"
                                     :dataSource="applications"
                                     :loading="applicationTableLoading"
                            >
                            <span slot="award_name" slot-scope="text, record">
                                @{{ findAwardInfoById(record.award_id).name }}
                            </span>
                                <span slot="project_name" slot-scope="text, record">
                                @{{ record.project_name ? record.project_name : '-' }}
                                    <br><a-tag v-if="record.status_id == 'A6'" color="orange">@{{ record.group_name }}</a-tag>
                            </span>
                                <span slot="applicant" slot-scope="text, record">
                                @{{ record.applicant_name }}
                                <a-popover :title="record.applicant_name + '的联系方式'">
                                    <template slot="content">
                                        <table>
                                            <tr>
                                                <td width="30"><a-icon type="phone"/></td>
                                                <td>@{{ record.applicant_tel }}</td>
                                            </tr>
                                            <tr>
                                                <td><a-icon type="mail"/></td>
                                                <td>@{{ record.applicant_email }}</td>
                                            </tr>
                                        </table>
                                    </template>
                                    <a style="font-size: 12px;" href="">联系方式</a>
                                </a-popover>
                                <br/>
                                @{{ record.applicant_org_name }}
                            </span>
                                <span slot="nominators" slot-scope="text, record">
                                <template v-if="findAwardInfoById(record.award_id).nomination_required">
                                    <p v-for="nominatorId in record.nominator_ids">@{{ getNominatorById(nominatorId).name }}</p>
                                </template>
                                <template v-else>-</template>
                            </span>
                                <span slot="application_form" slot-scope="text, record">
                                <a :href="'/home/fill-form?id=' + record.id" target="_blank">
                                    <span>查看</span>
                                </a>
                            </span>
                                <span slot="status" slot-scope="text, record">
                                <span class="phase-tag">@{{ record.status_info.phase }}阶段</span>
                                <div>@{{ record.status_info.status }}</div>
                            </span>
                                <span slot="todo" slot-scope="text, record">
                                <span class="orange">@{{ record.status_info.admin_todo }}</span>
                            </span>
                                <span slot="operations" slot-scope="text, record">
                                <template v-if="record.status_id == 'B2'">
                                    <a-popconfirm title="确认通过形式审查？"
                                                  @confirm="applicationThroughFormalReview(record)" okText="是"
                                                  cancelText="否">
                                        <a-button type="primary" size="small" :disabled="changingApplicationStatus"
                                        >通过形式审查</a-button>
                                    </a-popconfirm>
                                    <a-popconfirm title="确认退回该申报书？"
                                                  @confirm="showFillRecallReasonModal(record)" okText="是"
                                                  cancelText="否"
                                                  style="margin-left: 12px;">
                                        <a-button size="small"
                                        >退回修改</a-button>
                                    </a-popconfirm>
                                </template>
                                <template v-if="record.status_id === 'C2'">
                                    <a-popconfirm title="确认提交专家初评？"
                                                  @confirm="applicationSubmitExpertReview(record)" okText="是"
                                                  cancelText="否">
                                            <a-button type="primary" size="small"
                                            >提交专家初评</a-button>
                                    </a-popconfirm>
                                    <a-button style="margin-left: 10px;"
                                              v-show="record.pdf_file_save_path"
                                              size="small"
                                              @click="downloadAwardDoc(record.pdf_file_save_path)">
                                        下载打印版申报书</a-button>
                                </template>
                            </span>
                            </a-table>
                        </div>
                    </div>
                </div>
            </main>
            <a-modal
                    title="退回原因"
                    :visible="showRecallReasonModal"
                    @ok="confirmReasonModal"
                    @cancel="cancelReasonModal"
            >
                <a-textarea v-model="recallReason" placeholder="请填写退回原因" :rows="4"></a-textarea>
            </a-modal>
        </div>
    </a-locale-provider>
</script>

@include('common-js')

<script>
    const applicationListColumns = [
        {
            width: 60,
            title: '序号',
            dataIndex: 'num'
        }, {
            width: 90,
            title: '奖项类型',
            dataIndex: 'award_name',
            scopedSlots: {
                customRender: 'award_name'
            }
        }, {
            width: 150,
            title: '项目名称',
            dataIndex: 'project_name',
            scopedSlots: {
                customRender: 'project_name'
            }
        }, {
            width: 200,
            title: '申报者',
            dataIndex: 'applicant',
            scopedSlots: {
                customRender: 'applicant'
            }
        }, {
            width: 70,
            title: '申报书',
            dataIndex: 'application_form',
            scopedSlots: {
                customRender: 'application_form'
            }
        }, {
            width: 120,
            title: '申报状态',
            dataIndex: 'status',
            scopedSlots: {
                customRender: 'status'
            }
        }, {
            width: 100,
            title: '待办事项',
            dataIndex: 'applicant_todo',
            scopedSlots: {
                customRender: 'todo'
            }
        }
    ];

    var awardsInfo = {!! json_encode(array_values(config('vars.awards')), JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT) !!};
    var statusInfo = {!! json_encode(array_values(config('vars.status_defs')), JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT) !!};
    var nominators = {!! json_encode($nominators, JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT) !!};
    var applications = {!! json_encode($applications, JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT) !!};
    var defaultSelectedKeys = ['3-2-4']

    function processApplicationsData(applications) {
        var n = 1
        applications.forEach(item => {
            item.num = n
            n += 1
        })
    }

    processApplicationsData(applications)

    Vue.prototype.$axios = axios
    var app = new Vue({
        el: '#app',
        template: '#appTemplate',
        data: {
            viewStatusId: ['A5', 'A6'],
            defaultSelectedKeys: defaultSelectedKeys,
            showRecallReasonModal: false,
            recallReason: '',
            recallApplication: null,
            searchFields: {
                keyword: '',
                awardType: -1,
                awardStatus: -1
            },
            applicationTableLoading: false,
            chooseAwardToApplyDialogVisible: false,
            chooseNominatorsDialogVisible: false,
            newApplicationAwardId: awardsInfo[0].id,
            newApplicationNominatorId1: 0,
            newApplicationNominatorId2: 0,
            newApplicationNominatorId3: 0,
            newApplicationNominatorId4: 0,
            newApplicationNominatorId5: 0,
            applications: applications,
            nominators: nominators,
            changingApplicationStatus: false,
            deletingApplicationForm: false,
            awardsInfo: awardsInfo,
            statusInfo: statusInfo,
            applicationListColumns: applicationListColumns,
            changePasswordDialogVisible: false,
            passwordInfo: {
                password: '',
                passwordConfirm: ''
            },
            antdLocale: antd.locales.zh_CN
        },
        computed: {
            newApplicationAwardInfo() {
                return this.findAwardInfoById(this.newApplicationAwardId)
            },
            nominatorGroupNames() {
                var result = []
                this.nominators.forEach(item => {
                    if (!result.includes(item.group_name)) {
                        result.push(item.group_name)
                    }
                })
                return result
            }
        },
        mounted() {
        },
        methods: {
            applicationThroughFormalReview(application) {
                this.changeApplicationStatus(application, '/api/award/through-formal-review')
            },
            applicationSubmitExpertReview(application) {
                this.changeApplicationStatus(application, '/api/award/submit-expert-review')
            },
            showFillRecallReasonModal(application) {
                this.showRecallReasonModal = true
                this.recallApplication = application
            },
            confirmReasonModal() {
                if (this.recallReason === '') {
                    antd.message.warn('退回原因不能为空')
                    return false
                } else {
                    this.changeApplicationStatus(this.recallApplication, '/api/award/recall-application')
                    this.showRecallReasonModal = false
                }
            },
            changeApplicationStatus(application, url) {
                let postData = {
                    application_id: application.id
                }
                if (url === '/api/award/recall-application') {
                    this.showRecallReasonModal = true
                    postData.recall_reason = this.recallReason
                }
                this.changingApplicationStatus = true
                antd.message.loading('正在处理，请稍候', 0)
                axios.post(url, postData).then(res => {
                    antd.message.destroy()
                    var data = res.data
                    if (data.ok) {
                        antd.message.success('操作成功')
                        this.recallReason = ''
                        this.recallApplication = null
                        // this.reloadData()
                        history.go(0)
                    } else {
                        antd.message.warn(data.message, 3)
                    }
                    this.changingApplicationStatus = false
                })
            },
            cancelReasonModal() {
                this.showRecallReasonModal = false
            },
            awardSearchType(type) {
                console.log('type', type)
                this.searchFields.awardType = type
            },
            awardSearchStatus(status) {
                this.searchFields.awardStatus = status
            },
            searchAward() {
                this.reloadData()
            },
            resetSearch() {
                this.searchFields.keyword = ''
                this.searchFields.awardType = -1
                this.searchFields.awardStatus = -1
                this.reloadData('is_reset')
            },
            downloadAwardDoc(path) {
                window.open(path)
            },
            printAward(id) {
                window.open('/apply/show-print?award_id=' + id)
            },
            getNominatorById(id) {
                return this.nominators.filter(item => {
                    return item.id == id
                })[0]
            },
            getNominatorsByGroup(nominatorGroup) {
                return this.nominators.filter(item => {
                    return item.group_name == nominatorGroup
                })
            },
            changeApplicationStatusOld(application, statusId) {
                let data = {
                    application_id: application.id,
                    status_id: statusId
                }
                if (statusId === 'B1.2') {
                    this.showRecallReasonModal = true
                    data.recall_reason = this.recallReason
                }
                this.changingApplicationStatus = true
                antd.message.loading('正在处理，请稍候', 0)

                axios.post('/api/award/change-application-status', data).then(res => {
                    antd.message.destroy()
                    console.log(res)
                    var data = res.data
                    if (data.ok) {
                        antd.message.success('操作成功')
                        this.recallReason = ''
                        this.recallApplication = null
                        this.reloadData()
                    } else {
                        antd.message.warn(data.message, 3)
                    }
                    this.changingApplicationStatus = false
                })
            },
            handleDeleteApplication(application) {
                console.log('application', application)
                this.deletingApplicationForm = true
                antd.message.loading('正在处理，请稍候', 0)
                axios.post('/api/award/delete-application', {
                    application_id: application.id
                }).then(res => {
                    antd.message.destroy()
                    console.log(res)
                    var data = res.data
                    if (data.ok) {
                        antd.message.success('删除成功')
                        this.reloadData()
                    } else {
                        antd.message.warn(data.message, 3)
                    }
                    this.deletingApplicationForm = false
                })
            },
            showChooseNominatorsDialog() {
                this.chooseNominatorsDialogVisible = true
            },
            handleChooseNominatorsOk() {
                console.log('newApplicationAwardId', this.newApplicationAwardId)
                var nominatorIds = [this.newApplicationNominatorId1, this.newApplicationNominatorId2, this.newApplicationNominatorId3, this.newApplicationNominatorId4, this.newApplicationNominatorId5]
                nominatorIds = nominatorIds.filter(item => item != 0)
                var awardId = this.newApplicationAwardId
                var awardInfo = this.newApplicationAwardInfo
                console.log('nominatorIds', nominatorIds)
                if (nominatorIds.length == 0) {
                    antd.message.warn('{{ config('vars.strings.no_nominator_selected') }}')
                    return
                }
                this.submitNewApplication(awardId, nominatorIds)
                this.chooseNominatorsDialogVisible = false
            },
            handleChooseAwardToApplyOk() {
                console.log('newApplicationAwardId', this.newApplicationAwardId)
                this.chooseAwardToApplyDialogVisible = false
                var awardId = this.newApplicationAwardId
                var awardInfo = this.newApplicationAwardInfo
                if (awardInfo.nomination_required) {
                    this.showChooseNominatorsDialog()
                } else {
                    this.submitNewApplication(awardId, [])
                }
            },
            showChooseAwardToApplyDialog() {
                this.chooseAwardToApplyDialogVisible = true
            },
            findAwardInfoById(id) {
                return this.awardsInfo.filter(item => {
                    return item.id == id
                })[0]
            },
            reloadData(type = 'all') {
                let data = {
                    status_id: this.viewStatusId,
                    searchFields: JSON.stringify(this.searchFields)
                }
                if (type == "is_reset") {
                    data = {
                        status_id: this.viewStatusId
                    }
                }
                this.applicationTableLoading = true
                axios.post('/api/award/get-application-by-status', data).then(res => {
                    this.applicationTableLoading = false
                    antd.message.destroy()
                    var applications = res.data
                    console.log(applications)
                    processApplicationsData(applications)
                    this.applications = applications
                })
            },
            handleHeaderDropdownItemClick: handleHeaderDropdownItemClick,
            handleChangePasswordOk: handleChangePassword
        }
    })
</script>